import React, {
    useState,
    useMemo,
    useEffect,
    useContext,
    Fragment,
} from 'react';
import { Menu, Checkbox, Dropdown, Button, Space } from 'antd';
import { FilterOutlined } from '@ant-design/icons';

import { HcpTableContext } from '../HcpTable/HcpTable';
import './HcpColumnsFilter.less';
/**
 *
 * @param {*} { type }
 * @param {*} { dataSource }
 * @param {*} { handleChange }
 * @returns
 */
const HcpColumnsFilter = ({ filterInfo, handleChange }) => {
    const style = {
        width: '100vw',
        height: '100vh',
        position: 'fixed',
        top: 0,
        left: 0,
        zIndex: 1,
    };
    const [visible, setVisible] = useState(false);
    const [isint, setIsint] = useState(true);

    useEffect(() => {}, [visible]);

    // 获取表头筛选重置的状态
    const colReset = useContext(HcpTableContext);

    useEffect(() => {
        if (colReset) resetFileter();
    }, [colReset]);

    // 重置
    const resetFileter = () => {
        boxData.filter((item) => {
            item.checked = false;
        });
        setBoxData(JSON.parse(JSON.stringify(boxData)));
        if (handleChange) handleChange([]);
    };

    // 隐藏触发
    const handleSubmit = () => {
        // let bool = boxData.filter((item) => {
        // 	return item.checked;
        // })
        // if (handleChange) handleChange(bool);
    };

    return (
        <Fragment>
            <Dropdown
                overlay={
                    <div className="hcp_colimns_filter">
                        <div>条件</div>
                        <div>阈值</div>
                    </div>
                }
                trigger={['click']}
                visible={visible}
            >
                <span>
                    {' '}
                    {filterInfo.title}
                    <FilterOutlined
                        style={{
                            marginLeft: 10,
                            marginTop: 3,
                            position: 'absolute',
                            right: 4,
                            zIndex: 999,
                        }}
                        onClick={(e) => {
                            e.stopPropagation();
                            setVisible(true);
                        }}
                    />
                </span>
            </Dropdown>
            {visible && (
                <div
                    style={style}
                    onClick={() => {
                        setVisible(false);
                    }}
                 />
            )}
        </Fragment>
    );
};

export default HcpColumnsFilter;
